const path = require('path')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const {
    CleanWebpackPlugin
} = require('clean-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const CopyWebpackPlugin = require('copy-webpack-plugin')

module.exports = {
    mode: 'none',
    entry: './src/main.js', //入口文件
    output: {
        filename: '[name].bundle.js',
        chunkFilename: '[name].bundle.js',
        path: path.resolve(__dirname, 'dist'),
        clean: true,
    },
    module: {
        rules: [{
                test: /\.less$/,
                // use: [{
                //     loader: 'less-loader'
                // }]
                use: [
                    'style-loader',
                    'css-loader',
                    'less-loader'
                ]
            },
            {
                test: /\.vue$/,
                loader: 'vue-loader'
            },
            {
                test: /\.(png|jpe?g|gif)$/,
                use: {
                    loader: 'url-loader',
                    options: {
                        esModule: false, //添加后图片正常显示
                        name: 'img/[name].[contenthash:6].[ext]', //随机数
                        limit: 10 * 1024 //超出的就用file-loader
                    }
                }
            },
            {
                test: /\.css$/,
                use: [ //从后往前执行，先用到的要放到后边
                    'style-loader',
                    'css-loader'
                ]
            },
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: [{
                        loader: 'babel-loader',
                        options: {
                            presets: ['@babel/preset-env']
                        }
                    },
                    'eslint-loader'
                ]
            }
        ]

    },
    plugins: [
        new VueLoaderPlugin(),
        new CleanWebpackPlugin(),
        new HtmlWebpackPlugin({
            title: 'vue',
            template: './public/index.html',
            filename: 'index.html' //输出的文件
        }),
        new CopyWebpackPlugin({
            patterns: [{ from: './src/assets/**', to: './img' }, { from: 'public', to: './public' }] //拷贝assets和public
        })
    ]
}